<template>
    <Layout>
        <!--<Content :style="{ paddingLeft:'10px', background: '#fff'}">-->
        <Modal title="模板定制" :transfer=false v-model="model1" :width=800 @on-cancel="handleCancel"
               style="display: flex;align-items: center; justify-content: center;">
            <div v-if="showSaveBtn">
                <Form ref="form1datacopy" :model="form1datacopy" :rules="ruleCustom" label-position="top">

                    <Row type="flex" justify="space-around" class="code-row-bg">
                        <Col span="23">
                            <FormItem label="模板名称：" prop="modelName">
                                <Input type="text" v-model="form1datacopy.modelName" :disabled="isdisabledFn"></Input>
                            </FormItem>
                        </Col>
                    </Row>
                    <Row type="flex" justify="space-around" class="code-row-bg">
                        <Col span="11">
                            <FormItem label="模板简称：" prop="abbrName">
                                <Input type="text" v-model="form1datacopy.abbrName" :disabled="isdisabledFn"></Input>
                            </FormItem>
                        </Col>
                        <Col span="11">
                            <FormItem label="模板类型：" prop="modelType">
                                <!-- <treeselect v-model="form1datacopy.modelType" :options="modelTypeData" :load-options="loadOptions"/>-->
                                <Select filterable v-model="form1datacopy.modelType">
                                    <Option value='1000001011000000006'>拍照取证型</Option>
                                    <Option value='1000001011000000008'>评估扣分型</Option>
                                    <Option value='1000001011000000007'>评估打分型</Option>
                                </Select>
                            </FormItem>
                        </Col>
                    </Row>
                    <Row type="flex" justify="space-around" class="code-row-bg" style="padding-top: 5px">
                        <Col span="11" v-if="isdisabledFn == false">
                            <FormItem label="所属单位：" prop="belongOrgId">
                                <cascaderDom ref="childConOrg" @setOrgInfo="setOrgId" @setOrgname="setOrgName"
                                             :currentOrgId="currentOrgId" :currentOrgName="currentOrgName"
                                             :orgTree="true"></cascaderDom>
                            </FormItem>
                        </Col>
                        <Col span="11" v-if="isdisabledFn == true">
                            <FormItem label="所属单位：" prop="belongOrgId">
                                {{currentOrgName}}
                            </FormItem>
                        </Col>
                        <Col span="11">
                            <FormItem label="应用到下属单位：" prop="applyUnit">
                                <Select v-model="form1datacopy.applyUnit">
                                    <Option value="1">是</Option>
                                    <Option value="0">否</Option>
                                </Select>
                            </FormItem>
                        </Col>
                    </Row>
                    <Row type="flex" justify="space-around" class="code-row-bg">
                        <Col span="23">
                            <FormItem label="模板说明：" prop="modelDesc">
                                <Input v-model="form1datacopy.modelDesc" type="textarea" :disabled="isdisabledFn"
                                       :rows="2"/>
                            </FormItem>
                        </Col>
                    </Row>
                    <!-- <Row type="flex" justify="space-around" class="code-row-bg">
                         <Col span="23">
                             <FormItem>
                                 <Button type="primary" class='ivu-btn-save' :loading="buttonLoading"  @click="submit('form1datacopy')"
                                         v-if="showSaveBtn">确定
                                 </Button>
                                 <Button type="primary" class='ivu-btn-cancel' @click="handleCancel" v-if="showSaveBtn">
                                     取消
                                 </Button>
                             </FormItem>
                         </Col>
                     </Row>-->
                </Form>
            </div>
            <div v-else>
                <Form :model="form1datacopy" :label-width="140">
                    <Row type="flex" justify="space-around" class="code-row-bg">
                        <Col span="23">
                            <FormItem label="模板名称：" prop="modelName">
                                {{form1datacopy.modelName}}
                            </FormItem>
                        </Col>
                    </Row>
                    <Row type="flex" justify="space-around" class="detail-background-clor">
                        <Col span="11">
                            <FormItem label="模板简称：" prop="abbrName">
                                {{form1datacopy.abbrName}}
                            </FormItem>
                        </Col>
                        <Col span="11" style="padding-right: 5px">
                            <FormItem label="模板类型：" prop="modelType">
                                <!-- <treeselect v-model="form1datacopy.modelType" :options="modelTypeData" :load-options="loadOptions"/>-->
                                {{form1datacopy.modelType=='1000001011000000006'?'拍照取证型':form1datacopy.modelType=='1000001011000000008'?'评估扣分型':form1datacopy.modelType=='1000001011000000007'?'评估打分型':''}}
                                <!-- <Select filterable v-model="form1datacopy.modelType">
                                     <Option value='1000001011000000006'>拍照取证型</Option>
                                     <Option value='1000001011000000008'>评估扣分型</Option>
                                     <Option value='1000001011000000007'>评估打分型</Option>
                                 </Select>-->
                            </FormItem>
                        </Col>
                    </Row>
                    <Row type="flex" justify="space-around" class="code-row-bg" style="padding-top: 5px">
                        <Col span="11">
                            <FormItem label="所属单位：" prop="belongOrgId">
                                {{form1datacopy.currentOrgName}}
                            </FormItem>
                        </Col>
                        <Col span="11">
                            <FormItem label="应用到下属单位：" prop="applyUnit">
                                {{form1datacopy.applyUnit==1?'是':'否'}}
                            </FormItem>
                        </Col>
                    </Row>
                    <Row type="flex" justify="space-around" class="detail-background-clor">
                        <Col span="23">
                            <FormItem label="模板说明：" prop="modelDesc">
                                {{form1datacopy.modelDesc}}
                            </FormItem>
                        </Col>
                    </Row>
                    <!-- <Row type="flex" justify="space-around" class="code-row-bg">
                         <Col span="23">
                             <FormItem>
                                 <Button class='ivu-btn-save' @click="handleCancel">关闭</Button>
                             </FormItem>
                         </Col>
                     </Row>-->
                </Form>
            </div>

            <div slot="footer">
                <Button type="primary" class='ivu-btn-save' :loading="buttonLoading" @click="submit('form1datacopy')"
                        v-show="showSaveBtn">确定
                </Button>
                <Button type="primary" class='ivu-btn-cancel' @click="handleCancel" v-show="showSaveBtn">
                    取消
                </Button>
                <Button class='ivu-btn-save' v-show="!showSaveBtn" @click="handleCancel">关闭</Button>
            </div>
        </Modal>
        <!--</Content>-->
    </Layout>
</template>
<script>
    import {Api} from '../../../../api/index.js'
    import cascaderDom from '../../../../components/cascader-dom'
    /*
        import Treeselect from '@riophae/vue-treeselect'
    */
    import {sessionStorage} from '../../../../common/cacheUtils.js';
    import '@riophae/vue-treeselect/dist/vue-treeselect.css'

    export default {
        props: {
            model1:{
                type: Boolean,
                default: false
            },
        },
        components: {
            cascaderDom
        },
        data: function () {
            return {
                form1datacopy: {
                    modelId: '',
                    modelName: '',
                    ifOpenGps: '0',
                    abbrName: '',
                    specialty: '',
                    modelType: '',
                    modelBusiness: '',
                    modelDesc: '',
                    modelUserId: '',
                }, buttonLoading: false,
                applyUnit: '1',
                currentOrgId: '',
                currentOrgName: '',
                modelUserName: '',
                setselectionarr: [],
                specialtyData: [],
                modelTypeData: [],
                setCurrentName: [],
                modelBusinessData: [],
                showSaveBtn: true,
                isdisabledFn: false,
                ruleCustom: {
                    modelName: [{required: true, message: '  ', trigger: 'blur,change'}],
                    modelType: [{required: true, message: '  ', trigger: 'blur,change'}],
                    specialty: [{required: true, message: '  ', trigger: 'blur,change'}]
                },
                // model1: false,
            }
        },
        mounted() {

            this.selectCodingSort();
        },
        methods: {
            handleCancel(){this.$emit('addOrUpdateData');},
            selectCodingSort() {
                this.$http.get(Api.queryCodeDetailBySortId + '/1000001012', {params: {}}).then((res) => {
                    this.specialtyData = [];
                    res.data.data.map(item => {
                        let obj = {};
                        obj.id = item.codingCodeId;
                        obj.label = item.codingName;
                        obj.children = null;
                        this.specialtyData.push(obj);
                    });
                })
                this.$http.get(Api.queryCodeDetailBySortId + '/1000001011', {params: {}}).then((res) => {
                    this.modelTypeData = [];
                    res.data.data.map(item => {
                        let obj = {};
                        obj.id = item.codingCodeId;
                        obj.label = item.codingName;
                        obj.children = null;
                        this.modelTypeData.push(obj);
                    });
                })
                this.$http.get(Api.queryCodeDetailBySortId + '/1000001050', {params: {}}).then((res) => {
                    this.modelBusinessData = res.data.data;
                })
            },
            loadOptions({action, parentNode, callback}) {
                this.$http.get(Api.queryCodeDetailBySuperiorcode + "/" + parentNode.id, {params: {}}).then(res => {
                    if (res.data.data.length !== 0) {
                        parentNode.children = [];
                        res.data.data.map(item => {
                            let obj = {};
                            obj.id = item.codingCodeId;
                            obj.label = item.codingName;
                            obj.children = null;
                            parentNode.children.push(obj);
                        });
                        callback()
                    } else {
                        delete parentNode['children'];
                        callback();
                    }
                }).catch(e => {
                    console.log(e);
                    this.$Message.error('请求失败');
                })
            },
            setOrgId(data) {
                this.form1datacopy.belongOrgId = data[data.length - 1];
            },
            setOrgName(data) {
                this.form1datacopy.belongOrgName = data;
            },
            submit(name) {
                this.$refs[name].validate((valid) => {
                    if (valid) {
                        this.buttonLoading = true
                        this.form1datacopy.applyUnit = (this.applyUnit == true ? "1" : "0");
                        let updateDatas = {};

                        updateDatas.modelUserList = [];

                        if (this.form1datacopy.modelId == '') {
                            updateDatas.model = Object.assign(JSON.parse(sessionStorage('paramUserInfo').get('userInfo')), this.form1datacopy);
                        } else {
                            updateDatas.model = this.form1datacopy;
                        }
                        this.$http.post(Api.saveOrUpdateModel, updateDatas).then((res) => {
                            this.$Message.success("保存成功")
                            this.$emit('addOrUpdateData');
                            this.buttonLoading = false
                        }).catch(e => {
                            this.model1 = false;
                            this.$Message.error("数据获取失败")
                            this.buttonLoading = false
                        })
                    } else {
                        this.$Message.error('请填报完整!');
                    }
                })
            },
            /*handleCancel(e) {
                this.$emit('handleCancel', false);
            },*/

        },
    }
</script>
